<link rel="stylesheet" href="__STATIC__/widget/admin/region/region_style.css">
<div>
    <select name="province{$widget_data.name}" id="province_{$widget_data.name}" class="form-control addon-form-group-select"></select>
</div>

<script type="text/javascript">

    $(function(){

        var province_id = "{$widget_data['province']}";

        var get_options_url = '{:url("Widget/getRegionOptions")}';

        function changeProvince(province_id = 0, select_id = 0)
        {
            $.get(get_options_url, {upid: province_id, select_id: select_id, level : 1}, function(result){ console.log("province_{$widget_data.name}"); $("#province_{$widget_data.name}").html(result); });
        }

        changeProvince(0, province_id);

        $("#province_{$widget_data.name}").change(function(){ changeCity($("#province_{$widget_data.name}").val());});
    });
</script>